<template>
  <div>
    <h1 v-color="color">order组件</h1>
  </div>
</template>
<script>
export default {
  name: 'orders',
  data() {
    return {
      color: `rgb(${Math.random() * 255},${Math.random() * 255},${Math.random() * 255})`,
    }
  },
  methods: {},
  directives: {
    color: {
      // el指的是元素
      // binding: 指的是传来的参数
      // 当指令第一次被绑定到元素时被调用
      bind(el, binding) {
        el.style.color = binding.value
      },
      update(el, binding) {
        el.style.color = binding.value
      },
    },
  },

  // 全局定义
}
// }
// Vue.directives('color', function (el, binding) {
//   el.style.color = binding.value
// })
</script>
